<template>
  <div class="tool-bar">
    <el-dropdown trigger="click" placement="bottom">
      <el-button type="primary" icon="el-icon-edit">
        布局调整
        <i class="el-icon-arrow-down el-icon--right"></i>
      </el-button>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item @click.native="handleMergeCell">
          <i class="el-icon-copy-document"></i> 合并单元格
        </el-dropdown-item>
        <el-dropdown-item @click.native="handleSplitCell">
          <i class="el-icon-scissors"></i> 拆分单元格
        </el-dropdown-item>
        <el-dropdown-item @click.native="handleAddRow">
          <i class="el-icon-plus"></i> 新增行
        </el-dropdown-item>
        <el-dropdown-item @click.native="handleAddCol">
          <i class="el-icon-plus"></i> 新增列
        </el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>

    <el-button
      type="success"
      icon="el-icon-link"
      @click="openParamSelector"
      :disabled="!selectedCell"
    >
      关联参数
    </el-button>

    <el-dropdown trigger="click" placement="bottom">
      <el-button type="info" icon="el-icon-component">
        添加元素
        <i class="el-icon-arrow-down el-icon--right"></i>
      </el-button>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item @click.native="handleAddSignature">
          <i class="el-icon-user"></i> 签字栏
        </el-dropdown-item>
        <el-dropdown-item @click.native="handleAddText">
          <i class="el-icon-font"></i> 固定文本
        </el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>

    <el-button type="warning" icon="el-icon-view" @click="handlePreview">
      预览模板
    </el-button>

    <el-button type="danger" icon="el-icon-download" @click="handleExportExcel">
      导出Excel
    </el-button>

    <el-button type="primary" icon="el-icon-check" @click="handleSaveTemplate">
      保存模板
    </el-button>
  </div>
</template>

<script>
export default {
  name: 'ToolBar',
  props: {
    selectedCell: {
      type: Object,
      default: null
    },
    hasSelectedMerge: {
      type: Boolean,
      default: false
    }
  },
  methods: {
    // 合并单元格
    handleMergeCell() {
      this.$emit('merge-cell');
    },
    // 拆分单元格
    handleSplitCell() {
      this.$emit('split-cell');
    },
    // 新增行
    handleAddRow() {
      this.$emit('add-row');
    },
    // 新增列
    handleAddCol() {
      this.$emit('add-col');
    },
    // 关联参数
    openParamSelector() {
      this.$emit('open-param-selector');
    },
    // 添加签字栏
    handleAddSignature() {
      this.$emit('add-signature');
    },
    // 添加固定文本
    handleAddText() {
      this.$emit('add-text');
    },
    // 预览模板
    handlePreview() {
      this.$emit('preview');
    },
    // 导出Excel
    handleExportExcel() {
      this.$emit('export-excel');
    },
    // 保存模板
    handleSaveTemplate() {
      this.$emit('save-template');
    }
  }
};
</script>

<style scoped>
.tool-bar {
  display: flex;
  gap: 10px;
  padding: 10px 20px;
  background-color: #f5f5f5;
  border-bottom: 1px solid #e6e6e6;
}

.el-dropdown {
  display: inline-block;
}
</style>